<!DOCTYPE html>
<html lang="zh-CN">
  <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <meta name="apple-mobile-web-app-capable" content="yes"/>
      <meta name="viewport" content="width=device-width,initial-scale=1.0">
      <title>欧曼科技官网</title>
      <link href="css/bootstrap.min.css" rel="stylesheet">
      <link href="css/common.css" rel="stylesheet">
      <link href="css/index.css" rel="stylesheet">
      <link href="font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
      <link href="dist/aos.css" rel="stylesheet">
      <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
      <script src="js/bootstrap.min.js"></script>
      <script src="dist/aos.js"></script>
  </head>
  <body>
  <header>
      <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
          <div class="container-fluid nav-container">
              <div class="navbar-header">
                  <a href="index.html" class="navbar-brand">
                      <img src="media/avatar.jpg" class="nav-header-icon">
                  </a>
                  <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                      <span class="icon-bar"></span>
                      <span class="icon-bar"></span>
                      <span class="icon-bar"></span>
                  </button>
              </div>
              <div class="collapse navbar-collapse">
                  <ul class="navbar-nav nav menu">
                      <li class="active"><a class="nav-a" href="index.html">首页</a></li>
                      <li><a class="nav-a" href="#">产品</a>
                          <ul class="submenu">
                              <li><a href="#">Morph</a></li>
                              <li><a href="#">欧萌校园</a></li>
                              <li><a href="#">Morph众帮</a></li>
                              <li><a href="#">PicBind</a></li>
                          </ul>
                      </li>
                      <li><a class="nav-a" href="#">业务</a></li>
                      <li><a class="nav-a" href="#">新闻报道</a></li>
                      <li class="nav-li"><a href="#">关于</a>
                          <ul class="submenu">
                              <li><a href="team.html">欧曼团队</a></li>
                              <li><a href="#">我们的故事</a></li>
                              <li><a href="find.html">未来</a></li>
                          </ul>
                      </li>
                  </ul>
                  <div class="navbar-right" style="margin-right: 30px;">
                      <ul>
                          <li><i class="fa fa-google-plus fa-2x"></i></li>
                          <li><i class="fa fa-wechat fa-2x"></i></li>
                          <li><i class="fa fa-weibo fa-2x"></i></li>
                      </ul>
                  </div>
              </div>

          </div>
      </nav>

      <div id="banner">
          <div class="transparent-mask">
              <div class="inner">
                  <h1 aos="fade-up" aos-easing="ease" aos-delay="400">可能是东半球最牛逼的学生创业公司</h1>
                  <p aos="zoom-in" aos-easing="ease" aos-delay="600">一家做大学生市场和技术外包的科技公司，我们不仅开发软件，同时也创造硬件产品</p>
                  <button>浏览产品</button>
                  <div class="more">
                      <i class="fa fa-chevron-down fa-2x" aria-hidden="true"></i>
                      <p>更多</p>
                  </div>
              </div>
          </div>
      </div>
  </header>
  <div class="content">
      <section class="sec-1">
          <div class="wrapper">
              <div>
                  <h2 aos="fade-up" aos-easing="ease" aos-delay="400">优美的设计，高精尖的技术，一流的团队是根植我们的基因</h2>
                  <div class="sub-heading">
                      <p aos="fade-up" aos-easing="ease" aos-delay="600">欧曼创立之初，便以建造充满美感的产品作为自身的使命</p>
                  </div>
              </div>
              <div class="icon-group">
                  <span class="icon" aos="flip-up" aos-easing="ease" aos-delay="400"><i class="fa fa-eercast fa-3x"></i></span>
                  <span class="icon" aos="flip-down" aos-easing="ease" aos-delay="600"><i class="fa fa-apple fa-3x"></i></span>
                  <span class="icon" aos="flip-right" aos-easing="ease" aos-delay="800"><i class="fa fa-microchip fa-3x"></i></span>
              </div>
          </div>
      </section>
      <!--section2 开始-->
      <section class="sec-2">
          <div class="half-img-text">
              <div class="img-sec">
                  <img src="media/sec2-1.svg" width="500" height="500" aos="fade-up" aos-easing="ease" aos-delay="400">
              </div>
              <div class="text-sec">
                  <h2 aos="slide-left" aos-easing="ease" aos-delay="400">属于欧曼的年轻战场</h2>
                  <p aos="slide-left" aos-easing="ease" aos-delay="600">我们已经有三年之久的设计历史，从创立之初的细思微雕到如今的运筹帷幄，一气呵成，我们在不断的升级进化，不断完善产品和技术，砥砺前行，我们对设计的追求从未改变</p>
              </div>
          </div>
      </section>
      <!--section2 结束-->
      <!--section3 start-->
      <section class="sec-3">
          <div class="half-img-text">
              <div class="text-sec">
                  <h2 aos="slide-right" aos-easing="ease" aos-delay="400">我们雕琢互联网产品</h2>
                  <p aos="slide-right" aos-easing="ease" aos-delay="600">一群科技狂的挚爱，除了科技的酷炫与神奇，还有美丽动人的设计也不可或缺，</p>
              </div>
              <!--<div class="img-sec">-->
                  <!--<img src="media/sec2-1.png" width="500" height="500">-->
              <!--</div>-->
          </div>
      </section>
      <!--section3 stop-->
      <section class="sec-4">
          <div class="head-wrapper">
              <h2 aos="slide-up" aos-easing="ease" aos-delay="400">为什么选择欧曼</h2>
              <div class="sub-heading">
                  <p aos="slide-up" aos-easing="ease" aos-delay="600">我们是一家学生创业公司，技术上不输于大公司，却是用心做产品</p>
              </div>
          </div>
          <div class="card-group clear-fix">
              <div class="card" aos="slide-up" aos-easing="ease" aos-delay="700">
                  <h2>设计美观</h2>
                  <p>欧曼拥有专业的设计师团队，对产品的打磨细致严谨，我们当之无愧</p>
              </div>
              <div class="card" aos="slide-up" aos-easing="ease" aos-delay="800">
                  <h2>内容丰富</h2>
                  <p>我们也拥有一流的内容团队，我们为客户提供内容输出服务，我们有一流的编辑和记者，这是我们的优势所在</p>
              </div>
              <div class="card" aos="slide-up" aos-easing="ease" aos-delay="900">
                  <h2>社交元素</h2>
                  <p>欧曼的很多产品融入了社交元素，这让我们走得更近，对于技术外包项目我们也可以轻而易举的实现它，让您的产品牢牢的锁住用户的心</p>
              </div>
              <div class="card" aos="slide-up" aos-easing="ease" aos-delay="900">
                  <h2>定制化</h2>
                  <p>欧曼一直以追求自由和完美自居，我们力求个性化，对待产品同样如此，一款好的产品，定制功能是核心，而我们在这方面写了很多功夫</p>
              </div>
          </div>
      </section>
  </div>

  <footer>
      <div class="main-footer">
          <div class="two-third">
              <div class="one-fourth">
                  <h3>友情链接</h3>
                  <ul>
                      <li><a href="#">腾讯</a></li>
                      <li><a href="#">微博</a></li>
                      <li><a href="#">长沙校园</a></li>
                      <li><a href="#">DeepX</a></li>
                      <li><a href="#">新智元</a></li>
                  </ul>
              </div>
              <div class="one-fourth">
                  <h3>公司简介</h3>
                  <ul>
                      <li><a href="#">欧曼简介</a></li>
                      <li><a href="#">创始团队</a></li>
                      <li><a href="#">天使投资人</a></li>
                      <li><a href="#">发展历程</a></li>
                      <li><a href="#">业务简介</a></li>
                  </ul>
              </div>
              <div class="one-fourth">
                  <h3>招贤纳士</h3>
                  <ul>
                      <li><a href="#">欧曼团队</a></li>
                      <li><a href="#">薪资福利</a></li>
                      <li><a href="#">工作岗位</a></li>
                  </ul>
              </div>
              <div class="one-fourth">
                  <h3>黑科技</h3>
                  <ul>
                      <li><a href="#">欧曼神盾局</a></li>
                      <li><a href="#">入驻欧曼创客科技</a></li>
                      <li><a href="#">联系我们</a></li>
                  </ul>
              </div>
          </div>
          <div class="one-third">
              <div class="qrcode-group">
                  <div class="qrcode">
                      <img src="media/oumanxy.jpg" width="80" height="80">
                      <p>关注欧曼校园微信公众号</p>
                  </div>
                  <div class="qrcode">
                      <img src="media/hr.jpg" width="80" height="80">
                      <p>HR等你来调戏</p>
                  </div>
              </div>
          </div>
      </div>
      <div class="sub-footer">
          <ul class="share-group">
              <li><i class="fa fa-google-plus fa-2x"></i></li>
              <li><i class="fa fa-github fa-2x"></i></li>
              <li><i class="fa fa-wechat fa-2x"></i></li>
              <li><i class="fa fa-weibo fa-2x"></i></li>
              <li><i class="fa fa-facebook-square fa-2x"></i></li>
          </ul>
          <div class="copyright">
              &copy 欧曼信息科技有限公司 2017
          </div>
      </div>
  </footer>
  <script type="text/javascript">
      AOS.init({
          easing: 'ease-out-back',
          duration: 1000,
          once: false,
      });
  </script>
  </body>
</html>